<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>比赛报名登录界面</title>
  <meta name="description" content="particles.js is a lightweight JavaScript library for creating particles.">
  <meta name="author" content="Vincent Garreau" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
  <link rel="stylesheet" media="screen" href="css/style.css">
  <link rel="stylesheet" type="text/css" href="css/reset.css"/>
	<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
</head>
<body>

<div id="particles-js">
		<div class="login">
			<div class="login-top">
				登录
			</div>
			<div class="login-center clearfix">
				<div class="login-center-img"><img src="img/name.png"/></div>
				<div class="login-center-input">
					<input class="email" type="text" name="" value="" placeholder="邮箱" onfocus="this.placeholder=''" onblur="this.placeholder='邮箱'"/>
					<div class="login-center-input-text">邮箱</div>
				</div>
			</div>
			<div class="login-center clearfix">
				<div class="login-center-img"><img src="img/password.png"/></div>
				<div class="login-center-input">
					<input class="password" type="password" name="" value="" placeholder="请输入密码" onfocus="this.placeholder=''" onblur="this.placeholder='请输入密码'"/>
					<div class="login-center-input-text">密码</div>
				</div>
			</div>
			<div @click="userLogin" class="login-button">
				登录
			</div>
			<div class="login-button">
				<a href="reg.html" style="color: aliceblue;">去注册</a>
			</div>
		</div>
		<div class="sk-rotating-plane"></div>
</div>

<!-- scripts -->
<script src="js/particles.min.js"></script>
<script src="js/app.js"></script>
<script src="js/jquery.js"></script>
<!-- import Vue before Element -->
<script src="js/vue.js"></script>
<!-- import JavaScript -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script type="text/javascript">
	new Vue({
		el: '#particles-js',
		data:{
		},
		methods: {
			userLogin() {
				var email=$(".email").val();
				var password=$(".password").val();
				$.post(
						"/competitions/login.do",
						{uname:email,upass:password},
						function (data) {
							var  Content=data.responseContent;
							if (data.responseCode===200){
								Vue.prototype.$alert(email+'，欢迎您！', Content, {
									confirmButtonText: '确定',
									callback: action => {
										location.href="index.html";
									}
								});
							}else {
								Vue.prototype.$message.error(Content);
							}
						}
				)
			}
		}
	})
</script>
</body>
</html>
